<template>
	<view class="page">
		<view class="bg-header pad-30">
			<view class="header-box pad-28 py-40 radius-24 flex-row space-between flex-align">
				<view class="flex-row">
					<view class="">
						<view class="font-32 c-6">
							问答币
						</view>
						<view class="font-36 c-y mt-8">
							{{userMsgCount}}
						</view>
					</view>
					<view class="ml-40">
						<view class="font-32 c-6">
							会员时长
						</view>
						<view class="font-36 c-y mt-8">
							{{vipDay}}天
						</view>
					</view>
					<view class="ml-40">
						<view class="font-32 c-6">
							待提现
						</view>
						<view class="font-36 c-y mt-8">
							{{money}}元
						</view>
					</view>
				</view>
				<view class="right">
					<navigator hover-class="none" url="/pages/user/withdraw/withdraw" class="charge-btn btn">去提现</navigator>
				</view>
			</view>
		</view>
		
		<!-- 每日签到 -->
		<view class="pad mt-60 task-everyday">
			<view class="font-bold font-32 c-3">
				每日问答币领取
			</view>
			<view class="bg-white radius-16 mt-30 pad-26 flex space-between flex-align">
				<view class="left">
					<view class="font-30">
						签到领问答币({{isSign?1:0}}/1)
					</view>
					<view class="mt-12 c-y">
						{{msgCount}}问答币/次
					</view>
				</view>
				<view class="sign-btn btn radius-20" :class="[isSign?'bg-gray':'primary']" @click="signBtn">
					{{isSignText}}
				</view>
			</view>
			<view class="bg-white radius-16 mt-30 pad-26 flex space-between flex-align">
				<view class="left">
					<view class="font-30">
						邀请好友得现金
					</view>
					<!-- <view class="mt-12 c-y">
						{{msgCount}}问答币/次
					</view> -->
				</view>
				
				<!-- #ifdef MP-WEIXIN -->
				<button class="sign-btn btn radius-20 primary" open-type="share">点击邀请</button>
				<!-- #endif -->
				
				<!-- #ifdef APP-PLUS || H5 -->
				<view class="sign-btn btn radius-20 primary"  @click="inviteBtn">
					复制推广链接
				</view>
				<view class="sign-btn btn radius-20 primary"  @click="inviteImg">
					生成海报
				</view>
				<!-- #endif -->
				
			</view>
			<view class="mt-12 font-26 text-line2 c-6">
				联系客服:ygbdwm可申请开通高额比例合伙人
			</view>
		</view>
		
		<!-- 分销 -->
		<!-- <fenxiao></fenxiao> -->
		<!-- <view class="BulletBox">
			
		</view> -->
	</view>
</template>

<script setup>
	import {reactive, ref} from 'vue';
	import { onShow,onShareAppMessage,onShareTimeline } from "@dcloudio/uni-app"
	import { userInfo, SignIn, isTodaySign,getInviteUrl,getPoster } from '@/http/index.js';
	import { toast,vipDayCalc,copyUrl} from '@/utils/tools.js';
	// const user = reactive({
	// 	msgCount:0,
	// 	money:0,
	// 	vipDay:0,
	// })
	let inviteVo = {}
	let userMsgCount = ref(0);
	let vipDay = ref(0);
	let money = ref(0);
	let msgCount = ref(0);
	onShow(()=>{
		getUserInfo();
		getInviteUrlf();
		isTodaySign().then(res=>{
			if(res.data.type === '1'){
				isSign.value = true;
				isSignText.value = "已签到";
			}
			//每日签到给币数量
			msgCount.value = res.data.msgCount;
		})
	})
	onShareAppMessage((res)=>{
		return {
				title: inviteVo.inviteTitle,
				path: '/pages/index/index?pid='+inviteVo.pid,
				imageUrl: inviteVo.inviteImgUrl //分享图标，路径可以是本地文件路径、代码包文件路径或者网络图片路径.支持PNG及JPG。显示图片长宽比是 5:4
			}
	})
	onShareTimeline((res)=>{
		return {
				title: inviteVo.inviteTitle,
				path: '/pages/index/index?pid='+inviteVo.pid,
				imageUrl: inviteVo.inviteImgUrl //分享图标，路径可以是本地文件路径、代码包文件路径或者网络图片路径.支持PNG及JPG。显示图片长宽比是 5:4
			}
	})
	function getUserInfo(){
		userInfo().then(res=>{
			let data = res.data;
			userMsgCount.value = data.msgCount
			money.value = data.money
			vipDay.value = vipDayCalc(data.vipDate);
		})
	}
	function getInviteUrlf(){
		getInviteUrl().then(res=>{
			// console.log('getInviteUrl',res)
			inviteVo.h5Url = res.data.h5Url
			inviteVo.inviteTitle = res.data.inviteTitle
			inviteVo.inviteImgUrl = res.data.inviteImgUrl
			inviteVo.pid = res.data.pid
			inviteVo.inviteSummary = res.data.inviteSummary
			inviteVo.invitePosterUrl = res.data.invitePosterUrl
			console.log(inviteVo.inviteSummary)
			
		})
	}
	let isSignText = ref("立即签到");
	const isSign = ref(false);
	const signBtn = ()=>{
		if(!isSign.value){
			SignIn().then(res=>{
				uni.showToast({
					title:res.data,
					icon:'none'
				})
				isSign.value = true;
				isSignText.value = "已签到";
				getUserInfo();
			})
		}
		
		
	}
	const inviteBtn = ()=>{
		copyUrl(inviteVo.h5Url)
		// #ifdef APP-PLUS
		
		// #endif
		// #ifdef H5
			// let ua = navigator.userAgent.toLowerCase();
			// if (ua.match(/MicroMessenger/i) == "micromessenger"){
			// 	//是
			// 	uni.share({
			// 		provider: "weixin",
			// 		scene: "WXSceneSession",
			// 		type: 0,
			// 		href: inviteVo.h5Url,    // 分享跳转的链接
			// 		title: inviteVo.inviteTitle,    // 分享标题
			// 		summary: inviteVo.inviteSummary,    // 分享内容文字
			// 		imageUrl: inviteVo.inviteImgUrl,    //分享封面图片
			// 		success: function(res) {
			// 			// 此处是调起微信分享成功的回调
			// 		},
			// 		fail: function(err) {
			// 			// 此处是调起微信分享失败的回调
			// 		}
			// 	});
			// }else{
			// 	//不是
			// 	copyUrl(url)
				
			// }
			
		// #endif
	}
	const inviteImg = ()=>{
		//这里要生成一张海报 里面有二维码  二维码就是这个inviteVo.h5Url
		// console.log(inviteVo.h5Url,'1')
		// console.log(inviteVo.inviteImgUrl)
		// uni.setStorageSync('inviteVo', inviteVo);
		// uni.navigateTo({
		// 	url:`/pages/signin/thatPerson/thatPerson`
		// })
		uni.showLoading({
			title: '生成中...'
		});
		getPoster().then(res=>{
			uni.hideLoading();
			uni.setStorageSync('posterUrl', res.data);
			uni.navigateTo({
				url:`/pages/signin/thatPerson/thatPerson`
				// url:`/pages/signin/poster`
			})
		})
	}
	
</script>

<style lang="scss" scoped>
.c-y{
	color:$yellow;
}
.bg-header{
	background-color: $theme-color;
	height: 120rpx;
	padding:30rpx;
	// position: relative;
	.header-box{
		background-color: #FFF;
	}
}
.charge-btn{
	background-color: $yellow;
	color:#FFF;
	border-radius: 10rpx;
	line-height: 54rpx;
	height: 54rpx;
	display: block;
}
.task-everyday{
	margin-top:180rpx;
}
.sign-btn{
	height:50rpx;
	line-height: 50rpx;
	background-color: #E5E5E5;
	font-size: 26rpx;
	&.primary{
		background-color: $theme-color;
	}
}
// .BulletBox{
// 	position: absolute;
// 	width: 500rpx;
// 	height: 500rpx;
// 	background: mediumaquamarine;
// 	top: 0rpx;
// 	left: 0rpx;
// }
</style>
